import React, { useState } from 'react'
import { View, Text, Input, Image, Textarea, Picker } from '@tarojs/components'
import PageWrapper from '@/components/PageWrapper'
import ChangeAvatar from '@/components/ChangeAvatar/ChangeAvatar'
import { navigateTo } from '@/utils/navigation'
import './index.scss';
import {useUser} from "@/hook/useUser";
import Taro from '@tarojs/taro';
const Page: React.FC = () => {
  const { user, loading, logout } = useUser();
  const sexList = ['男', '女']
  const [selectedIndex, setSelectedIndex] = useState(0)
  const handleAvatarChange = (newAvatar: string) => {
    console.log('新的头像路径：', newAvatar)
    // 可执行上传逻辑或保存到状态管理
  }
  const handleChange = (e) => {
    setSelectedIndex(e.detail.value)
  }
  return (
  <PageWrapper title="个人信息" showBack={true} backgroundColor='#F0F0F0'>
      <View className="sell-viedo-page">
        <View className="sell-viedo-msg-box">
          <View>
            <View className="viedo-title-item">修改信息</View>
            <ChangeAvatar onChange={handleAvatarChange} />
            <View className="online-goods-item">
              <View className="online-goods-title">昵称：</View>
              <Input className="online-goods-input" placeholder="请输入"></Input>
            </View>
            <View className="online-goods-item">
              <View className="online-goods-title">电话：</View>
              <Input className="online-goods-input" placeholder="请输入"></Input>
            </View>
            <View className="online-goods-item">
              <View className="online-goods-title">地址：</View>
              <Input className="online-goods-input" placeholder="请输入"></Input>
            </View>
            <View className="online-goods-item">
              <View className="selector-container">
                <Text className="label">类型：</Text>
                <Picker mode="selector" range={sexList} onChange={handleChange}>
                  <View className="picker-view">
                    {sexList[selectedIndex]}
                  </View>
                </Picker>
              </View>
            </View>
            <View className="online-goods-item">
              <View className="online-goods-title">简介：</View>
              <Textarea className="online-goods-input" placeholder="请输入"></Textarea>
            </View>
          </View>
        </View>
        <View className="submit-but">修改</View>
        <View className="auth-box">
          <View
            className="auth-item"
            onClick={() => {
              if (user?.realNameAuth) {
                // Taro.showModal({
                //   title: '提示',
                //   content: '您已实名认证，是否修改？',
                //   confirmText: '修改',
                //   cancelText: '取消',
                // }).then(res => {
                //   if (!res.confirm) {
                //     // 用户选择取消，直接返回
                //     return;
                //   }
                //   // 用户选择修改，可继续填写或触发修改逻辑
                //   navigateTo('/pages/user/real-name/index');
                // });
                // return; // 阻止继续执行接口请求

                Taro.showToast({ title: '您已实名认证', icon: 'none' });
              } else {
                navigateTo('/pages/user/real-name/index');
              }
            }}
          >
            <View className="real-name">
              <Image src={require(`../../../assets/user/real-name.png`)} />
            </View>
            <View className="title">实名认证</View>
          </View>
          <View className="auth-item" onClick={() => navigateTo('/pages/user/identification-user/index')}>
            <View className="appraiser">
              <Image src={require(`../../../assets/user/appraiser.png`)}/>
            </View>
            <View className="title">鉴定师认证</View>
          </View>
        </View>
      </View>
    </PageWrapper>
  )
}

export default Page
